<template>
    <div id="w_invite" v-transfer-dom>        
        <x-dialog hide-on-blur :show.sync="showValue" class="dialog-demo">
            <div class="img-box">
              <img :src="qrcodeurl" style="max-width:100%">              
            </div>
            <p><b>1.分享邀请</b>:微信右上方点击分享</p>
            <p><b>2.屏幕截图</b>:二维码截图发送他人</p>
            <!-- <p><b>3.复制信息</b>:自动复制信息发朋友</p> -->
            <div @click="showValue=false">
              <span class="vux-close"></span>
            </div>
        </x-dialog>
    </div>
</template>
<script>
import {
    TransferDomDirective as TransferDom,    
    Popup,XButton, Divider,Group,XDialog
} from 'vux'
import {
    mapState,
    mapActions
} from 'vuex'
import axios from "axios"
import api from '../api'
import { taskAndTag } from "./mixin";
import { help } from "./mixinApp";
// import Clipboard from "clipboard";

export default {
    directives: {
        TransferDom
    },
    components: {    
        Popup,XButton, Divider,Group,XDialog
    },
    props:{        
        show: Boolean,
        param:Object,
    },
    mixins: [taskAndTag,help],   
    computed:{        
        ...mapState({
            uid: state => state.vux.uid,
            openid: state => state.vux.openid,
            userinfo: state => state.vux.userinfo,
            isloginApp: state => state.vux.isloginApp,
            proCurr: state => state.z39.proCurr,
        })
    },
    watch: {
        show(val){            
            this.showValue = val ;
            // this.qrcodeurl = "http://cdns.7dtime.com/wechat.png"; //test
            if(val){
                // console.log("param:",this.param);
                let sdata = {xid:this.param.gid,type:1} ;
                sdata.wxapp = true ;
                if(window.__wxjs_environment === 'miniprogram') sdata.wxapp = true ;
                api.invitefriends(sdata).then(data=>{
                    console.log("invie retue:",data);
                    if(data.errno!=0)return this.$vux.toast.show({text:data.errmsg,type: 'warn'});
                    var url = data.data ;
                    var pt = this.proCurr.title.substr(0,4);
                    if(sdata.wxapp){  //小程序二维码
                        this.qrcodeurl = url ;
                    }else{  //h5二维码
                        url = encodeURIComponent(url);
                        this.qrcodeurl = `http://qr.liantu.com/api.php?text=${url}&logo=cdns.7dtime.com/logo200.png` ;
                    }
                    doAllShare({ type: "invite", pathH5: url,title:"邀请你加入项目:"+pt })
                    // if (window.__wxjs_environment === 'miniprogram') wx.miniProgram.postMessage({ data: JSON.stringify(sd) })
  
                })                
            }
        },
        param(val){
            let sdata = {xid:this.param.gid,type:1} ;
            if(window.__wxjs_environment === 'miniprogram') {
                sdata.wxapp = true ;
                api.invitefriends(sdata)
            }
        },
        showValue(val){
            this.$emit('toVisible',val) ; 
        }
    },
    created() {
        
    },
    mounted: function() {        
        
    },
    methods: {
        ...mapActions([
        ])
    },
    data() {
        return {
            showValue:false,
            qrcodeurl:"",
            bgSrc:"",
            logourl:"//cdns.7dtime.com/logo40.png",
        }
    }
}
</script>

<style lang="less" scoped>

@import '~vux/src/styles/close';
#w_invite .dialog-demo {
  .weui-dialog{
    border-radius: 8px;
    padding-bottom: 8px;
  }
  .dialog-title {
    line-height: 30px;
    color: #666;
  }
  .img-box {
    height: 300px;
    overflow: hidden;
  }
  .vux-close {
    margin-top: 8px;
    margin-bottom: 8px;
  }
}
</style>